﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>多 X 轴示例</title>
    <script src="Scripts/jquery-3.0.0.min.js"></script>
    <script src="jslib/echarts.min.js"></script>
</head>
<body>
    <div id="main" style="width: 800px;height:500px;"></div>

    <script>
        var myChart = echarts.init(document.getElementById("main"));


        $.post("PieDataCoursePassRateHandler.ashx", {},
            function (data, textStatus, jqXHR) {
                var resData = eval(data);
                var option = {
                    title: {
                        text: '多 X 轴示例'
                    },
                    tooltip: {
                        trigger: 'axis'
                    },
                   
                    legend: {
                        data: resData.Course
                    },
                    grid: {
                        left: '3%',
                        right: '4%',
                        bottom: '3%',
                        containLabel: true
                    },
                    toolbox: {
                        feature: {
                            saveAsImage: {}
                        }
                    },
                    xAxis: {
                        type: 'category',
                        boundaryGap: false,
                        data: resData.ExamDate
                    },
                    yAxis: {
                        type: 'value'
                    },
                    series: resData.CoursePassRate
                };
                myChart.setOption(option);
            },
            "json"
        );

       
    </script>
</body>
</html>